<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>品优购官网-专业的综合网上购物商城</title>
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/index.css">
</head>

<body>
    <!-- 顶部导航栏 -->
    <div class="shortcut">
        <div class="w">
            <div class="fl">
                <ul>
                    <li>品优购欢迎您！</li>
                    <li><a href="javascript:;">请登录</a></li>
                    <li><a href="javascript:;" class="red-color">免费注册</a></li>
                </ul>
            </div>
            <div class="fr">
                <ul>
                    <li>
                        <a href="javascript:;">我的订单</a>
                    </li>
                    <li class="spacer"></li>
                    <li>
                        <a href="javascript:;">我的品优购</a>
                        <img src="icon/down.svg" alt="">
                    </li>
                    <li class="spacer"></li>
                    <li>
                        <a href="javascript:;">品优购会员</a>
                    </li>
                    <li class="spacer"></li>
                    <li>
                        <a href="javascript:;">企业采购</a>
                    </li>
                    <li class="spacer"></li>
                    <li>
                        <a href="javascript:;">关注品优购</a>
                        <img src="icon/down.svg" alt="">
                    </li>
                    <li class="spacer"></li>
                    <li>
                        <a href="javascript:;">客户服务</a>
                        <img src="icon/down.svg" alt="">
                    </li>
                    <li class="spacer"></li>
                    <li>
                        <a href="javascript:;">网站导航</a>
                        <img src="icon/down.svg" alt="">
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- header区域 -->
    <header class="w">
        <div class="logo">
            <img src="images/logo.png" alt="">
        </div>
        <div class="search-warp">
            <input type="text" class="search" placeholder="9块9带回家！">
            <button class="search-btn">搜索</button>
        </div>
        <div class="hotwords">
            <a href="javascript:;" class="red-color">优惠购首发</a>
            <a href="javascript:;">亿元优惠</a>
            <a href="javascript:;">9.9元团购</a>
            <a href="javascript:;">满99减30</a>
            <a href="javascript:;">办公用品</a>
            <a href="javascript:;">电脑</a>
            <a href="javascript:;">通信</a>
        </div>
        <div class="shopcar">
            <a href="javascript:;">
                <img src="icon/shopcar.svg" alt="">
                <span>我的购物车</span>
            </a>
        </div>
    </header>
    <!-- 导航栏 -->
    <nav>
        <div class="w">
            <div class="dropdown">
                <div class="list-hd">全部商品分类</div>
            </div>
            <div class="navlist">
                <ul>
                    <a href="javascript:;">
                        <li>服装城</li>
                    </a>
                    <a href="javascript:;">
                        <li>美妆馆</li>
                    </a>
                    <a href="javascript:;">
                        <li>传智超市</li>
                    </a>
                    <a href="javascript:;">
                        <li>全球购</li>
                    </a>
                    <a href="javascript:;">
                        <li>闪购</li>
                    </a>
                    <a href="javascript:;">
                        <li>团购</li>
                    </a>
                    <a href="javascript:;">
                        <li>拍卖</li>
                    </a>
                    <a href="javascript:;">
                        <li>有趣</li>
                    </a>
                </ul>
            </div>
        </div>
    </nav>
    <!-- 主要内容 -->
    <div class="w clearfix">
        <div class="list-bd">
            <ul>
                <li class="menu_item">
                    <a href="javascript:;">家用电器</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">手机</a>
                    <a href="javascript:;">数码</a>
                    <a href="javascript:;">通信</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">电脑</a>
                    <a href="javascript:;">办公</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">家具</a>
                    <a href="javascript:;">家居</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">个护</a>
                    <a href="javascript:;">化妆</a>
                    <a href="javascript:;">清洁</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">运动户外</a>
                    <a href="javascript:;">钟表</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">汽车</a>
                    <a href="javascript:;">汽车用品</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">食品</a>
                    <a href="javascript:;">酒类</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">医药保健</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">图书</a>
                    <a href="javascript:;">音像</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">彩票</a>
                    <a href="javascript:;">票务</a>
                    <img src="icon/right.svg" alt="">
                </li>
                <li class="menu_item">
                    <a href="javascript:;">理财</a>
                    <a href="javascript:;">白条</a>
                    <a href="javascript:;">保险</a>
                    <img src="icon/right.svg" alt="">
                </li>
            </ul>
        </div>
        <div class="main">
            <div class="focus">
                <img src="images/主页.png" alt="">
            </div>
            <div class="newflash">
                <div class="news">
                    <div class="news_hd">
                        <h3>品特优快报</h3>
                        <a href="javascript:;">更多</a>
                    </div>
                    <div class="news_bd">
                        <ul>
                            <li>
                                <a href="javascript:;">【特惠】北站开学季全民半价购数码</a>
                            </li>
                            <li>
                                <a href="javascript:;">【公告】品优稳占家电网购刘成份额</a>
                            </li>
                            <li>
                                <a href="javascript:;">【特惠】百元中秋全品类礼券哪里领</a>
                            </li>
                            <li>
                                <a href="javascript:;">【公告】上品优生鲜享阳澄湖大闸蟹</a>
                            </li>
                            <li>
                                <a href="javascript:;">【特惠】每日享折扣品优品质游</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="lifeservice">
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                    <div>
                        <p>话费</p>
                    </div>
                </div>
                <div class="bargin">
                    <a href="javascript:;">
                        <img src="images/service.png" alt="">
                    </a>
                </div>
            </div>
        </div>
    </div>

    <!-- 今日推荐 -->
    <div class="recommend w">
        <div class="rec-clock">
            <img src="images/clock.png" alt="加载失败">
            <h3>今日推荐</还>
        </div>
        <div class="rec-img">
            <a href="javascript:;"><img src="images/rm1.jpg" alt=""></a>
            <a href="javascript:;"><img src="images/rm1.jpg" alt=""></a>
            <a href="javascript:;"><img src="images/rm1.jpg" alt=""></a>
            <a href="javascript:;"><img src="images/rm4.jpg" alt=""></a>
        </div>
    </div>
    <!-- 猜你喜欢 -->
    <div class="youlike w">
        <div class="youlike-title">
            <h3>猜你喜欢</h3>
            <a href="javascript:;">换一批</a>
        </div>
        <div class="youlike-pic">
            <ul>
                <li><a href="javascript:;"><img src="images/yl1.jpg" alt="加载失败"></a></li>
                <li><a href="javascript:;"><img src="images/yl2.jpg" alt="加载失败"></a></li>
                <li><a href="javascript:;"><img src="images/yl1.jpg" alt="加载失败"></a></li>
                <li><a href="javascript:;"><img src="images/yl2.jpg" alt="加载失败"></a></li>
                <li><a href="javascript:;"><img src="images/yl1.jpg" alt="加载失败"></a></li>
                <li><a href="javascript:;"><img src="images/yl2.jpg" alt="加载失败"></a></li>
            </ul>
        </div>
    </div>
    <!-- 有趣区 -->
    <div class="funarea w">
        <h3>有趣区</h3>
        <div class="funarea_content">
            <div class="funbook">
                <a href="javascript:;">
                    <img src="images/fa_book.jpg">
                </a>
            </div>
            <div class="goods">
                <div class="goods-title">
                    <a href="javascript:;">好东西</a>
                </div>
                <div class="goods-jp">
                    <a href="javascript:;">
                        <img src="images/fa_jp.jpg" alt="">
                    </a>
                </div>
                <div class="goods-ft">
                    <a href="javascript:;">
                        <img src="images/fa_good.jpg" alt="">
                    </a>
                </div>
            </div>
            <div class="pinpaijie">
                <a href="javascript:;">品牌街</a>
                <div class="fun_dianfanbao">
                    <a href="javascript:;">
                        <img src="images/fa_dfb.jpg" alt="">
                    </a>
                </div>
                <div class="pin_dapai">
                    <a href="javascript:;">
                        <img src="images/fa_dapai.jpg" alt="">
                    </a>
                </div>
                <div class="pin_tm">
                    <a href="javascript:;">
                        <img src="images/fa_tm.jpg" alt="">
                    </a>
                </div>
            </div>
            <div class="funarea_ico">
                <a href="javascript:;">
                    <img src="images/fa_ico.jpg" alt="">
                </a>
            </div>
        </div>

    </div>
    <!-- 楼层区 -->
    <div class="floor w clearfix">
        <div class="jiadian">
            <div class="box_hd clearfix">
                <h3 class="red-color">家用电器</h3>
                <ul class="tab_list">
                    <li><a href="javascript:;" class="red-color">热门</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">大家电</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">生活电器</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">厨房电器</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">个护健康</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">应季电器</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">空气/净水</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">新奇特</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">高端电器</a></li>
                </ul>
                <!-- <div style="clear:both;"></div> -->
            </div>
            <div class="box_bd">
                <ul class="tab-con">
                    <li class="w209">
                        <ul class="tab-con-list">
                            <li><a href="javascript:;">节能补贴</a></li>
                            <li><a href="javascript:;">4K电视</a></li>
                            <li><a href="javascript:;">空气净化器</a></li>
                            <li><a href="javascript:;">IH电饭煲</a></li>
                            <li><a href="javascript:;">滚筒洗衣机</a></li>
                            <li><a href="javascript:;">电热水器</a></li>
                        </ul>
                        <a href="javascript:;"><img src="images/jd1.jpg" alt="1"></a>
                    </li>
                    <li><a href="javascript:;"><img src="images/jd2.jpg" alt="2"></a></li>
                    <li class="w220">
                        <a href="javascript:;"><img src="images/jd3.jpg" alt="3"></a>
                        <a href="javascript:;"><img src="images/jd4.jpg" alt="4"></a>
                    </li>
                    <li class="w220">
                        <a href="javascript:;"><img src="images/jd5.jpg" alt="5"></a>
                    </li>
                    <li class="w220">
                        <a href="javascript:;"><img src="images/jd3.jpg" alt="3"></a>
                        <a href="javascript:;"><img src="images/jd4.jpg" alt="4"></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 手机层 -->
    <div class="floor w clearfix">
        <div class="jiadian">
            <div class="box_hd clearfix">
                <h3 class="red-color">家用电器</h3>
                <ul class="tab_list">
                    <li><a href="javascript:;" class="red-color">热门</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">大家电</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">生活电器</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">厨房电器</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">个护健康</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">应季电器</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">空气/净水</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">新奇特</a></li>
                    <li><span>|</span></li>
                    <li><a href="javascript:;">高端电器</a></li>
                </ul>
                <!-- <div style="clear:both;"></div> -->
            </div>
            <div class="box_bd">
                <ul class="tab-con">
                    <li class="w209">
                        <ul class="tab-con-list">
                            <li><a href="javascript:;">节能补贴</a></li>
                            <li><a href="javascript:;">4K电视</a></li>
                            <li><a href="javascript:;">空气净化器</a></li>
                            <li><a href="javascript:;">IH电饭煲</a></li>
                            <li><a href="javascript:;">滚筒洗衣机</a></li>
                            <li><a href="javascript:;">电热水器</a></li>
                        </ul>
                        <a href="javascript:;"><img src="images/jd1.jpg" alt="1"></a>
                    </li>
                    <li><a href="javascript:;"><img src="images/jd2.jpg" alt="2"></a></li>
                    <li class="w220">
                        <a href="javascript:;"><img src="images/jd3.jpg" alt="3"></a>
                        <a href="javascript:;"><img src="images/jd4.jpg" alt="4"></a>
                    </li>
                    <li class="w220">
                        <a href="javascript:;"><img src="images/jd5.jpg" alt="5"></a>
                    </li>
                    <li class="w220">
                        <a href="javascript:;"><img src="images/jd3.jpg" alt="3"></a>
                        <a href="javascript:;"><img src="images/jd4.jpg" alt="4"></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- footer -->
    <div class="footer clearfix">
        <div class="w">
            <div class="mod_service">
                <ul>
                    <li>
                        <i class="mod_service_zheng"></i>
                        <div class="mod_service_tit">
                            <h5>正品保证</h5>
                            <p>正品保证，提供发票</p>
                        </div>
                    </li>
                    <li>
                        <i class="mod_service_zheng"></i>
                        <div class="mod_service_tit">
                            <h5>正品保证</h5>
                            <p>正品保证，提供发票</p>
                        </div>
                    </li>
                    <li>
                        <i class="mod_service_zheng"></i>
                        <div class="mod_service_tit">
                            <h5>正品保证</h5>
                            <p>正品保证，提供发票</p>
                        </div>
                    </li>
                    <li>
                        <i class="mod_service_zheng"></i>
                        <div class="mod_service_tit">
                            <h5>正品保证</h5>
                            <p>正品保证，提供发票</p>
                        </div>
                    </li>
                    <li>
                        <i class="mod_service_zheng"></i>
                        <div class="mod_service_tit">
                            <h5>正品保证</h5>
                            <p>正品保证，提供发票</p>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="mod_help">
                <dl class="mod_help_item">
                    <dt>购物指南</dt>
                    <dd><a href="javascript:;">购物流程</a></dd>
                    <dd><a href="javascript:;">会员介绍</a></dd>
                    <dd><a href="javascript:;">生活旅行/团购</a></dd>
                    <dd><a href="javascript:;">常见问题</a></dd>
                    <dd><a href="javascript:;">大家电</a></dd>
                    <dd><a href="javascript:;">联系客服</a></dd>
                </dl>
                <dl class="mod_help_item">
                    <dt>购物指南</dt>
                    <dd><a href="javascript:;">购物流程</a></dd>
                    <dd><a href="javascript:;">会员介绍</a></dd>
                    <dd><a href="javascript:;">生活旅行/团购</a></dd>
                    <dd><a href="javascript:;">常见问题</a></dd>
                    <dd><a href="javascript:;">大家电</a></dd>
                    <dd><a href="javascript:;">联系客服</a></dd>
                </dl>
                <dl class="mod_help_item">
                    <dt>购物指南</dt>
                    <dd><a href="javascript:;">购物流程</a></dd>
                    <dd><a href="javascript:;">会员介绍</a></dd>
                    <dd><a href="javascript:;">生活旅行/团购</a></dd>
                    <dd><a href="javascript:;">常见问题</a></dd>
                    <dd><a href="javascript:;">大家电</a></dd>
                    <dd><a href="javascript:;">联系客服</a></dd>
                </dl>
                <dl class="mod_help_item">
                    <dt>购物指南</dt>
                    <dd><a href="javascript:;">购物流程</a></dd>
                    <dd><a href="javascript:;">会员介绍</a></dd>
                    <dd><a href="javascript:;">生活旅行/团购</a></dd>
                    <dd><a href="javascript:;">常见问题</a></dd>
                    <dd><a href="javascript:;">大家电</a></dd>
                    <dd><a href="javascript:;">联系客服</a></dd>
                </dl>
                <dl class="mod_help_item">
                    <dt>购物指南</dt>
                    <dd><a href="javascript:;">购物流程</a></dd>
                    <dd><a href="javascript:;">会员介绍</a></dd>
                    <dd><a href="javascript:;">生活旅行/团购</a></dd>
                    <dd><a href="javascript:;">常见问题</a></dd>
                    <dd><a href="javascript:;">大家电</a></dd>
                    <dd><a href="javascript:;">联系客服</a></dd>
                </dl>
                <dl class="mod_help_item">
                    <dt>帮助中心</dt>
                    <dd><img src="images/wx_cz.jpg" alt="2"></dd>
                </dl>
            </div>
            <div class="mod_copyright">
                <p>
                    <a href="javascript:;">关于我们</a>
                    <span>|</span>
                    <a href="javascript:;">联系我们</a>
                    <span>|</span>
                    <a href="javascript:;">联系客服</a>
                    <span>|</span>
                    <a href="javascript:;">商家入驻</a>
                    <span>|</span>
                    <a href="javascript:;">营销中心</a>
                    <span>|</span>
                    <a href="javascript:;">手机品优购</a>
                    <span>|</span>
                    <a href="javascript:;">友请链接</a>
                    <span>|</span>
                    <a href="javascript:;">Contact</a>
                </p>
                <p>地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn
                    <br>

                    京ICP备08001421号京公网安备110108007702
                </p>
            </div>
        </div>

    </div>

</body>

</html>